* {
  outline: none;
  padding: 0;
  margin: 0;
}

html,
body {
  height: 100vh;
  overflow: hidden;
}


#root {
  display: flex;
  flex-direction: column;
  background-color: var(--bg);
  height: 100%;

  div,
  li,
  p,
  ul {
    // user-select: none;
    // -moz-user-select: none;
    // -webkit-user-select: none;
    // -ms-user-select: none;
  }

  a {
    text-decoration: none;
    color: inherit;
  }

  a:focus {
    outline: none;
  }

  .page-main {
    flex: 1;
    min-height: calc(100vh - 50px);
    margin: 0;
    display: flex;
    padding: 0;
    box-sizing: border-box;

    .page-container {
      flex: 1;
      padding: 10px 10px;
    }
  }
}

div,
span,
ul,
p {
  &::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    border-radius: 5px;
    background: none;
  }

  &::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background: none;
  }

  &::-webkit-scrollbar-track {
    margin: 1px;
    background: none;
  }

  &:hover {
    &::-webkit-scrollbar {
      border: 1px solid var(--scrollbar-track-background-color);
      background-color: transparent;
    }

    &::-webkit-scrollbar-track {}

    &::-webkit-scrollbar-thumb {
      border-radius: 5px;
      background: var(--select-hover);
    }
  }
}

input:-internal-autofill-selected {
  -webkit-text-fill-color: var(--font-1) !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: row nowrap;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background: none repeat scroll 0 0 #f7f7f7;
  text-align: center;
}

.preloader img,
.preloader svg {
  margin: 0 auto;
}